<template>
	<view class="content">
		
			<view class="section-1">
				<view class="section-body">
					<view class="list">
						<view class="item">
							<view class="top">
								<view class="left">
									<view class="part">
										可研设计单位：{{data.study_unit}}
									</view>
									<view class="part">
										主设人：{{data.study_people}}
									</view>
									<view class="part">
										联系方式：{{data.study_tel}}
									</view>
									<view class="part">
										交付时间：{{data.study_time}}
										
									</view>
									<view class="part">
										评审时间：{{data.study_reply}}
										
									</view>
									<view class="part-file">
										<view class="download">
											<text class="iconfont icon-huixingzhen"></text>
											<text class="file-name">{{data.study_doc}}</text>
										</view>
										<view class="download">
											<text class="iconfont icon-huixingzhen"></text>
											<text class="file-name">{{data.study_approval}}</text>
										</view>
									</view>
								</view>
							</view>
							<view class="mid">
								<view class="label">备注：</view>
								<view class="textarea-body">{{data.study_remark}}</view>
							</view>
							<!-- 
								<view class="bottom">
									<view class="left">所属单位：{{item.dw_name}}</view>
									<view class="right">所属职位：{{item.zrr_position}}</view>
								</view>
							-->
						</view>
						<view class="item">
							<view class="top">
								<view class="left">
									<view class="part">
										初步设计单位：{{data.design_unit}}
									</view>
									<view class="part">
										初步设计主设人：{{data.design_people}}
									</view>
									<view class="part">
										联系方式：{{data.design_tel}}
									</view>
									<view class="part file">
										预审时间：{{data.design_time}}
									</view>
									<view class="part">
										内审时间：{{data.design_check_time}}
									</view>
									<view class="part">
										上报评审计划时间：{{data.design_up_time}}
									</view>
									<view class="part">
										评审时间：{{data.design_up_reply}}
									</view>
									<view class="part">
										收口时间：{{data.design_closing}}
									</view>
									<view class="part">
										批复时间：{{data.design_reply}}
									</view>
									<view class="part-file">
										<view class="download">
											<text class="iconfont icon-huixingzhen"></text>
											<text class="file-name">{{data.design_doc}}</text>
										</view>
										<view class="download">
											<text class="iconfont icon-huixingzhen"></text>
											<text class="file-name">{{data.design_approval}}</text>
										</view>
									</view>
								</view>
							</view>
							<view class="mid">
								<view class="label">备注：</view>
								<view class="textarea-body">{{data.design_remark}}</view>
							</view>
							<!-- 
								<view class="bottom">
									<view class="left">所属单位：{{item.dw_name}}</view>
									<view class="right">所属职位：{{item.zrr_position}}</view>
								</view>
							-->
						</view>
					</view>
				</view>
			</view>
	</view>
</template>

<script>
	import { progressListApi } from '@/api/statistics.js';
	import { mapGetters } from 'vuex';
	
	export default {
		data() {
			return {
				data: {},
				mescroll: null, // mescroll实例对象 (此行可删,mixins已默认)
				upOption: {
					textNoMore: '-- 没有更多了 --'
				},
				pageSize: 20,
				list: [],
				id: 0,
				point1: 0,
				point2: 0,
				tabList: [
					{
						name: '检查扣分',
						id: 1,
						type: '1'
					},
					{
						name: '违章扣分',
						id: 2,
						type: '2'
					},
				],
				curIdx: 0,
				curName: '检查扣分',
			}
		},
		onLoad(data) {
			this.id = data.id;
			this.point1 = data.point1;
			this.point2 = data.point2;
			this.data = this.getTempData;
		},
		computed: {
			...mapGetters({getTempData: 'system/getTempData'})
		},
		methods: {
			setCurIdx(idx, name) {
				this.curIdx = idx;
				this.curName = name;
				uni.showLoading({
					title: '加载中。。。'
				})
				setTimeout(() => {
					uni.hideLoading()
				}, 500)
				this.mescroll.resetUpScroll();
				this.mescroll.scrollTo(0,0);
			},
			handleResetForm(){
				for (let key in this.form) {
					this.form[key] = '';
				}
				this.mescroll.resetUpScroll();
				this.mescroll.scrollTo(0,0);
			},
			handleSearch(){
				this.mescroll.resetUpScroll();
				this.mescroll.scrollTo(0,0);
			},
			mescrollInit(mescroll) {
				this.mescroll = mescroll;
			},
			async upCallback(page) {
				const {data} =  await progressListApi({
					// project_id: this.id,
					project_id: '3ad4ed48-9140-48c2-a3e8-a320da6867f9',
					page: page.num,
					pageSize: this.pageSize,
				});
				
				if (data.code === 1 || data.code === 200) {
					// 接口返回的当前页数据列表 (数组)
					let curPageData = data.data; 
					// 接口返回的当前页数据长度 (如列表有26个数据,当前页返回8个,则curPageLen=8)
					let curPageLen = curPageData.length; 
					// 接口返回的总页数 (如列表有26个数据,每页10条,共3页; 则totalPage=3)
					let totalPage = data.data.last_page; 
					//设置列表数据
					if(page.num == 1) this.list = []; //如果是第一页需手动置空列表
				
					this.list = this.list.concat(curPageData); //追加新数据
					// 请求成功,隐藏加载状态
					this.mescroll.endByPage(curPageLen, totalPage); 
					setTimeout(()=>{
						// this.mescroll.endSuccess(curPageLen);
						this.mescroll.endSuccess(1);
					},20);
				} else{
					//  请求失败,隐藏加载状态
					this.mescroll.endErr()
				}
			},
		},
	}
</script>

<style lang="scss" scoped>	
	.section-1{
		width: 100%;
		background: #2e5efe;
		.section-body{
			width: 100%;
			height: 100%;
			border-top-left-radius: 50rpx;
			border-top-right-radius: 50rpx;
			background-color: #fff;
			overflow: hidden;
			.list{
				width: 100%;
				box-sizing: border-box;
				padding: 0 35rpx;
				padding-top: 40rpx;
				.item{
					width: 100%;
					border-radius: 30rpx;
					@include common-box-shadow;
					margin-bottom: 40rpx;
					box-sizing: border-box;
					padding: 30rpx 20rpx;
					.top{
						width: 100%;
						@include clear;
						margin-bottom: 10rpx;
						.left{
							width: 100%;
							@include font-normal
							.part{
								width: 100%;
								line-height: 30rpx;
								margin-bottom: 10rpx;
								.download{
									float: right;
									.iconfont{
										font-size: 26rpx;
										color: #1d33c6;
										margin-right: 5rpx;
									}
									.file-name{
										color: #1d33c6;
										font-weight: bold;
										color: #1d33c6;
									}
								}
							}
							.part-file{
								width: 100%;
								line-height: 30rpx;
								margin-bottom: 10rpx;
								.download{
									width: 100%;
									margin-bottom: 10rpx;
									.iconfont{
										font-size: 26rpx;
										color: #1d33c6;
										margin-right: 5rpx;
									}
									.file-name{
										color: #1d33c6;
										font-weight: bold;
										color: #1d33c6;
									}
								}
							}
						}
					}
					.mid{
						margin-bottom: 20rpx;
						.label{
							@include font-normal;
							margin-bottom: 10rpx;
						}
						.textarea-body{
							box-sizing: border-box;
							width: 100%;
							height: 200rpx;
							border: none;
							padding: 15rpx!important;
							font-weight: normal;
							font-stretch: normal;
							letter-spacing: 0rpx;
							font-size: 25rpx;
							border-radius: 15rpx;
							background-color: #ededed;
							color: #3b3c40;
							overflow-y: scroll;
						}		
					}
					.bottom{
						width: 100%;
						font-size: 18rpx;
						color: #3b3c40;
						.left{
							width: 100%;
							margin-bottom: 10rpx;
						}
						.right{
							width: 100%;
						}
					}
				}
			}
		}
	}
</style>
